<template>
	<el-button type="primary" icon="el-icon-search" @click="selectData" style="margin-left: 10px" v-if="this.disabled!=true">回填</el-button>
	<el-dialog title="数据回填对话框" v-model="visible" :width="800" destroy-on-close @closed="closeDialog">
		<div class="right-panel-search">
			<el-input v-model="search.keyword" placeholder="查询关键词"></el-input>
			<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
		</div>
		<el-container>
			<scTable ref="table" :data="tableData" row-key="id" stripe>
				<el-table-column label="#" type="index" width="50"></el-table-column>
				<el-table-column v-for="item in fieldColumnList" :label="item.label" :prop="item.prop" width="200" :show-overflow-tooltip="true"></el-table-column>
				<el-table-column label="操作" fixed="right" align="right">
					<template #default="scope">
						<el-button-group>
							<el-button size="small" @click="fillData(scope.row, scope.$index)">回填</el-button>
						</el-button-group>
					</template>
				</el-table-column>
			</scTable>
		</el-container>
	</el-dialog>
</template>
<script>

export default {
	name: "Data Fill Dialog",
	emits: ['success', 'closed'],
	components: {
	},
	props: {
		dbInterFace:{type:String},
		apiObj:{type:String},
		dataMap:{type:String},
		disabled:{type:Boolean}
	},
	data() {
		return {
			visible: false,
			isSaveing: false,
			disabledS:this.disabled,
			dialog: {
				isShow: false
			},
			search: {
				faceId:'',
				keyword: null
			},
			fieldColumnList:[],
			fillFieldList:[],
			getDataApiObj:'',
			tableData:[],
			fillDataValue:[],
		}
	},
	created() {
		let fieldArr = this.dataMap.split(",");
		fieldArr.forEach(item=>{
			let fieldInfo = item.split(":");
			this.fieldColumnList.push({label:fieldInfo[0],prop:fieldInfo[1]});
			this.fillFieldList.push({field:fieldInfo[2],key:fieldInfo[1]});
		})
	},
	mounted() {
		this.getTableData();
	},
	methods:{
		selectData()
		{
			this.dialog.isShow = true
			this.$nextTick(() => {
				this.visible = true;
				return this
			})
		},
		async getTableData(){
			if(this.apiObj!=null && this.apiObj!='')
			{
				this.getDataApiObj = this.thisField.options.apiObj;
			}else {
				this.search.faceId = this.dbInterFace;
				this.getDataApiObj = this.$API.system.sysDbInterface.getDataBySysDbInterface;
			}
			let res = await this.getDataApiObj.get(this.search);
			if(res.code==200)
			{
				this.tableData = res.data;
			}
		},
		fillData(row,index)
		{
			this.fillDataValue=[];
			this.fillFieldList.forEach(item=>{
				this.fillDataValue.push({field:item.field,value:row[item.key]});
			})
			this.$emit('successFill', this.fillDataValue)
			this.dialog.isShow = false
			this.$nextTick(() => {
				this.visible = false;
				return this
			})
		},
		closeDialog() {
			this.$emit('closed')
		},
		//搜索
		async upsearch() {
			let res = await this.getDataApiObj.get(this.search);
			if(res.code==200)
			{
				this.tableData = res.data;
			}
		},
	}
}
</script>
<style>

</style>
